<!DOCTYPE html>
<html lang="zh-CN" style="height: 100%">
<head>
    <meta charset="utf-8">
</head>
<body style="height: 100%; margin: 0">
<div id="container" style="height: 100%"></div>


<script th:src="@{/js/jquery.min.js?v=2.1.4}"></script>
<script th:src="@{/js/appjs/base.js}"></script>
<script th:src="@{/js/plugins/echarts/echarts.common.min.js}" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
    var dom = document.getElementById('container');
    var myChart = echarts.init(dom, null, {
        renderer: 'canvas',
        useDirtyRect: false
    });
    var option;
    $(function () {
        var url = top.ctx + "/animal/rfidSyncData/temperature/" + base.getQueryString("num")
        $.ajax({
            type: 'POST',
            url: url,
            success: function (r) {
                option = {
                    tooltip: {
                        trigger: 'axis',
                        formatter: function (params) {
                            params = params[0];
                            var date = new Date(params.name);
                            return (
                                params.name +
                                '    ' +
                                params.value[1] + '℃'
                            );
                        },
                        axisPointer: {
                            animation: false
                        }
                    },
                    xAxis: {
                        type: 'time',
                        splitLine: {
                            show: false
                        }
                    },
                    yAxis: {
                        type: 'value',
                        boundaryGap: [0, '100%'],
                        splitLine: {
                            show: false
                        }
                    },
                    series: [
                        {
                            name: 'Fake Data',
                            type: 'line',
                            showSymbol: false,
                            data: r.data
                        }
                    ]
                };
                if (option && typeof option === 'object') {
                    myChart.setOption(option);
                }
                window.addEventListener('resize', myChart.resize);
            }
        });
    });
</script>
</body>
</html>